<template>
  <div class="about" @mousemove="MoveMouse">
    <p>{{x}}--{{y}}</p>
    <hr/>
    <img :src="DogUrl">
  </div>
</template>

<script lang="ts">
import {defineComponent} from "vue";
export default defineComponent({
    name:"AboutView",
})
</script>

<script lang="ts" setup>
import useMoveMouse from "@/hooks/useMoveMouse";
import useShowDog from "@/hooks/useShowDog";

const {x,y,MoveMouse} = useMoveMouse()

const {DogUrl} = useShowDog()
</script>

<style lang="scss" scoped>
.about{
  height: 600px;
  width: 100%;
  border: 1px solid #2c3e50;
}
</style>